<template>
    <div class="box">
        <h2>Child2 - 开启命名空间</h2>
        <div>count: {{ $store.state.testspace.count }}</div>
        <div>count: {{ count }}</div>
        <div>tenflodCount: {{ $store.getters['testspace/tenflodCount'] }}</div>
        <div>tenflodCount: {{ tenflodCount }}</div>
        <button @click="$store.dispatch('testspace/increment', 3)">actions修改count</button>
        <button @click="increment(4)">actions修改count</button>
        <br>
        <button @click="$store.commit('testspace/ADD', 7)">mutations修改count</button>
        <button @click="ADD(5)">mutations修改count</button>
    </div>
</template>

<script>
import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
export default {
    name: "Child2",
    computed: {
        ...mapState({
            count: state => state.testspace.count
        }),
        ...mapGetters('testspace', ['tenflodCount'])
    },
    methods: {
        ...mapActions('testspace', ['increment']),
        ...mapMutations('testspace', ['ADD'])
    },
    // mounted() {
    //     console.log(this.$store.getters)
    // }
};
</script>

<style scoped>
</style>
